<template>
    <div>
        <h2>当前求和为：{{ sum }}</h2>
        <h2>放大10倍为：{{ bigSum }}</h2>
        <br>
        <select v-model.number="n">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
        <button @click="add">加</button>
        <button @click="reduce">减</button>
    </div>
</template>
<script setup name='Count' lang="ts">
    import { ref } from "vue"
    import {useCountStore} from '@/store/count'
    import {storeToRefs} from 'pinia' 
    let countStore=useCountStore()
    //storeToRefs只会关注sotre中数据，不会对方法进行ref包裹
    let {sum,bigSum} =storeToRefs(countStore)

    let n=ref(1)
    
    function add(){
        countStore.jia(333)
    }

    function reduce(){
        countStore.sum-=n.value
    }

</script>
<style scoped>
</style>
